<template>
  <div>
    <v-tableTitle :btnConfig="btnConfig" :tableSelectData="tableSelectData" title="授权订购关系" ></v-tableTitle>
    <GTable ref="table" :hasCheck="true" :hasEdit="true" :api="apiMap.getListApi" :columnSource="baseColumns" :cbFun="cbFun" @selection-change="data => tableSelectData = data"
            @setdialog="setdialog" />

    <el-dialog :title="dialogModule.title" :visible.sync="dialogModule.flag" center v-dialogDrag width="720px" @closed="closed">
      <div v-tit="'授权订购关系'">
        <GForm ref="detail" :config="formConfig" :rules="formRules" labelWidth="120px" v-model="form"></GForm>
      </div>
      <span slot="footer">
        <el-button type="primary" @click="dialogModule.flag = false">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import tableTitle from 'commons/TableTitle'

export default {
  name: 'subscription',
  data() {
    return {
      tableSelectData: [],
      dialogModule: {
        loading: false,
        flag: false,
        title: '',
        data: null,
        type: ''
      },
      form: {
        id: null,
        salesp: '',
        cptype:'',
        qty: '',
        branchcode: '',
        branchname: '',
        province: '',
        city: '',
        district: '',
        town: '',
        detail:'',
        brandcode:'',
        customercodes:'',
      },

    }
  },
  computed: {
    btnConfig() {
      return []
    },
    baseColumns() {
      return [
        {
          label: '主键ID',
          prop: 'id',
          input: 'input'
        },
        {
          label: '平台',
          prop: 'salesp',
          input: 'select',
          options: [
            { label: '淘宝', value: 'TB' },
            { label: '抖音', value: 'DY' },
            { label: '拼多多', value: 'PDD' },
            { label: '京东', value: 'JD' },
            { label: '小红书', value: 'XHS' },
            { label: '得物', value: 'DW' },
          ]
        },
        {
          label: '服务商业务类型',
          prop: 'cptype',
          input: 'select',
          options: [
            { label: '直营', value: '1' },
            { label: '加盟', value: '2' },
            { label: '落地配', value: '3' },
            { label: '直营带网点', value: '4' },
          ]
        },
        {
          label: '面单余额数量',
          prop: 'qty',
          input: 'input',
        },
        {
          label: '网点Code',
          prop: 'branchcode',
          input: 'input',
        },
        {
          label: '网点名称',
          prop: 'branchname',
          input: 'input'
        },
        {
          label: '省',
          prop: 'province',
          input: 'input'
        },
        {
          label: '市',
          prop: 'city',
          input: 'input'
        },
        {
          label: '区',
          prop: 'district',
          input: 'input'
        },
        {
          label: '街道/镇',
          prop: 'town',
          input: 'input'
        },
        {
          label: '详细地址',
          prop: 'detail',
          input: 'input'
        },
        {
          label: '品牌code',
          prop: 'brandcode',
          input: 'input'
        },
        {
          label: '月结卡号',
          prop: 'customercodes',
          input: 'input'
        },
        {
          label: '创建时间',
          prop: 'adddate',
          input: 'input'
        },
      ]
    },
    formConfig() {
      return [
        {
          label: '平台',
          prop: 'salesp',
          type: 'select',
          options: [
            { label: '淘宝', value: 'TB' },
            { label: '抖音', value: 'DY' },
            { label: '拼多多', value: 'PDD' },
            { label: '京东', value: 'JD' },
            { label: '小红书', value: 'XHS' },
            { label: '得物', value: 'DW' },
          ]
        },
        {
          label: '服务商业务类型',
          prop: 'cptype',
          type: 'select',
          options: [
            { label: '直营', value: '1' },
            { label: '加盟', value: '2' },
            { label: '落地配', value: '3' },
            { label: '直营带网点', value: '4' },
          ]
        },
        {
          label: '面单余额数量',
          prop: 'qty',
          type: 'input',
        },
        {
          label: '网点Code',
          prop: 'branchcode',
          type: 'input',
        },
        {
          label: '网点名称',
          prop: 'branchname',
          type: 'input'
        },
        {
          label: '省',
          prop: 'province',
          type: 'input'
        },
        {
          label: '市',
          prop: 'city',
          type: 'input'
        },
        {
          label: '区',
          prop: 'district',
          type: 'input'
        },
        {
          label: '街道/镇',
          prop: 'town',
          type: 'input'
        },
        {
          label: '详细地址',
          prop: 'detail',
          type: 'input'
        },
        {
          label: '品牌code',
          prop: 'brandcode',
          type: 'input'
        },
        {
          label: '月结卡号',
          prop: 'customercodes',
          type: 'input'
        },

      ]
    },
    formRules() {
      return {
      }
    },
    apiMap() {
      return {
        getListApi: '/v1/plExpressSubscription/qryPlExpressSubscriptionList',
        getInfoApi:'/v1/plExpressSubscription/qryPlExpressSubscriptionById',
      }
    }
  },
  methods: {

    getInfoById(id) {
      this.$post(this.apiMap.getInfoApi, {
        id
      }).then(res => {
        this.form = res.data.item
        this.dialogModule.flag = true
      })
    },
    setdialog(data) {
      this.dialogModule.title = `查看授权订购关系`
      this.dialogModule.type = 'view'
      this.dialogModule.data = data
      this.getInfoById(data.id)
    },


    closed() {
      this.$refs.detail?.resetFields()
    },
    cbFun(res) {
      return { list: res.data.page.records, total: res.data.page.total }
    },
    async getTableData() {
      this.$refs.table.getTableData()
    }
  },
  mounted() {

  },
  components: {
    'v-tableTitle': tableTitle
  }
}
</script>

<style scoped>
</style>
